<template>
  <div class="resultSearch">
    <div class="searchBar">
      <div class="searchForm">
        <el-radio-group
          v-model="searchParams.state"
          @change="handleSearch">
          <el-radio-button
            v-for="item in stateOption"
            :key="item.value"
            :label="item.value">
            {{item.label}}
          </el-radio-button>
        </el-radio-group>
      </div>
      <div class="operateForm">
        <el-alert
          title="完成的文件记录系统将保留24小时后自动删除"
          type="info"
          :closable="false">
        </el-alert>
      </div>
    </div>
    <el-table
      stripe
      height="100%"
      size="mini"
      :data="tableData"
      v-loading="loading"
      style="width: 100%">
      <el-table-column
        :index="getIndex"
        type="index"
        label="#">
      </el-table-column>
      <el-table-column
        prop="createTime"
        label="时间">
      </el-table-column>
      <el-table-column
        prop="type"
        label="类型">
        <template slot-scope="scope">
          <span v-if="scope.row.type === '1'">标准查询</span>
          <span v-if="scope.row.type === '2'">高级查询</span>
          <span v-if="scope.row.type === '3'">高级搜索</span>
          <span v-if="scope.row.type === '4'">企业核验</span>
          <span v-if="scope.row.type === '5'">企业找回</span>
        </template>
      </el-table-column>
      <el-table-column prop="total" label="总数"></el-table-column>
      <el-table-column prop="verification" label="核验数量"></el-table-column>
      <el-table-column prop="findSum" label="找回数量"></el-table-column>
      <el-table-column prop="assessmentSum" label="评估数量"></el-table-column>
      <el-table-column label="操作" width="400">
        <template slot-scope="scope">
          <template v-if="scope.row.type === '4'">
            <el-button
              :disabled="scope.row.find !== 0"
              size="mini"
              type="primary"
              @click="findData(scope.row, '一键找回')">
              一键找回
            </el-button>
            <el-button
              :disabled="scope.row.assessment !== 0"
              size="mini"
              type="primary"
              @click="findData(scope.row, '一键评估')">
              一键评估
            </el-button>
          </template>
          <template v-if="scope.row.type === '5'">
            <el-button
              :disabled="scope.row.assessment !== 0"
              size="mini"
              type="primary"
              @click="findData(scope.row, '一键评估')">
              一键评估
            </el-button>
          </template>
          <el-button
            size="mini"
            type="primary"
            @click="handleCheckResult(scope.row)">
            查看
          </el-button>
          <el-button
            size="mini"
            type="danger"
            @click="handleExportResult(scope.row)">
            下载
          </el-button>
          <el-button
            size="mini"
            type="danger"
            @click="handleDeleteItem(scope.row)">
            删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <div class="pageContain">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="searchParams.pageNum"
        :page-size="searchParams.pageSize"
        :page-sizes="[20, 50, 100]"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
      </el-pagination>
    </div>


    <el-dialog
      title="详情"
      :visible.sync="dialogVisible"
      :fullscreen="true">
      <el-table
        stripe
        height="calc(100vh - 300px)"
        size="mini"
        :data="dialogTableData"
        v-loading="loading_"
        style="width: 100%">
        <template v-if="['1'].includes(this.dialogType)">
          <el-table-column :index="getIndex_" type="index" label="#"  width="100"></el-table-column>
          <el-table-column prop="market" label="市" width="100"></el-table-column>
          <el-table-column prop="distinguish" label="区" width="100"></el-table-column>
          <el-table-column prop="year" label="评估年份" width="100"></el-table-column>
          <el-table-column prop="name" label="企业名称"></el-table-column>
          <el-table-column prop="code" label="社会统一信用代码" width="200"></el-table-column>
          <el-table-column
            v-if="myFields.includes('规模评估（区间）')"
            prop="business"
            label="规模评估"
            width="200">
          </el-table-column>
          <el-table-column
            v-if="myFields.includes('效益评估（区间）')"
            prop="payTaxes"
            label="效益评估"
            width="200">
          </el-table-column>
          <el-table-column
            v-if="myFields.includes('资产评估（区间）')"
            prop="property"
            label="资产评估"
            width="200">
          </el-table-column>
          <el-table-column
            v-if="myFields.includes('负债评估（区间）')"
            prop="liabilities"
            label="负债评估"
            width="200">
          </el-table-column>
        </template>
        <template v-if="['2'].includes(this.dialogType)">
          <el-table-column :index="getIndex_" type="index" label="#"  width="100"></el-table-column>
          <el-table-column prop="market" label="市" width="100"></el-table-column>
          <el-table-column prop="distinguish" label="区" width="100"></el-table-column>
          <el-table-column prop="year" label="评估年份" width="100"></el-table-column>
          <el-table-column prop="name" label="企业名称"></el-table-column>
          <el-table-column prop="code" label="社会统一信用代码" width="200"></el-table-column>
          <el-table-column
            v-if="myFields.includes('规模评估')"
            prop="business"
            label="规模评估"
            width="200">
          </el-table-column>
          <el-table-column
            v-if="myFields.includes('效益评估')"
            prop="payTaxes"
            label="效益评估"
            width="200">
          </el-table-column>
          <el-table-column
            v-if="myFields.includes('资产评估')"
            prop="property"
            label="资产评估"
            width="200">
          </el-table-column>
          <el-table-column
            v-if="myFields.includes('负债评估')"
            prop="liabilities"
            label="负债评估"
            width="200">
          </el-table-column>
        </template>
        <template v-if="['3'].includes(this.dialogType)">
          <el-table-column :index="getIndex_" type="index" label="#"  width="100"></el-table-column>
          <el-table-column prop="market" label="市" width="100"></el-table-column>
          <el-table-column prop="distinguish" label="区" width="100"></el-table-column>
          <el-table-column prop="year" label="评估年份" width="100"></el-table-column>
          <el-table-column prop="name" label="企业名称"></el-table-column>
          <el-table-column prop="code" label="社会统一信用代码" width="200"></el-table-column>
          <el-table-column prop="business" label="规模评估" width="200"></el-table-column>
          <el-table-column prop="payTaxes" label="效益评估" width="200"></el-table-column>
          <el-table-column prop="property" label="资产评估" width="200"></el-table-column>
          <el-table-column prop="liabilities" label="负债评估" width="200"></el-table-column>
        </template>
        <template v-if="['4', '5'].includes(this.dialogType)">
          <el-table-column :index="getIndex_" type="index" label="#"  width="100"></el-table-column>
          <el-table-column prop="entName" label="公司"></el-table-column>
          <el-table-column prop="phone" label="号码"></el-table-column>
          <el-table-column prop="legalPerson" label="法人"></el-table-column>
          <el-table-column prop="position" label="职位">
            <template slot-scope="scope">
              <span>{{jobOption[scope.row.position]}}</span>
            </template>
          </el-table-column>
        </template>
        <template v-if="dialogAssessment === 1">
          <el-table-column prop="year" label="年份"></el-table-column>
          <el-table-column prop="code" label="社会统一代码"></el-table-column>
          <el-table-column prop="business" label="规模评估"></el-table-column>
          <el-table-column prop="payTaxes" label="效益评估"></el-table-column>
        </template>
      </el-table>
      <div class="pageContain">
        <el-pagination
          @size-change="handleSizeChange_"
          @current-change="handleCurrentChange_"
          :current-page="dialogParams.pageNum"
          :page-size="dialogParams.pageSize"
          :page-sizes="[20, 50, 100]"
          layout="total, sizes, prev, pager, next, jumper"
          :total="dialogTotal">
        </el-pagination>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">关闭</el-button>
      </span>
    </el-dialog>

    <el-dialog
      width="600px"
      :title="findDialogTitle"
      :visible.sync="findDialogVisible">
      <el-form label-position="top" label-width="80px">
        <el-form-item :label="`请选择${findDialogTitle.split('一键')[1]}范围`">
          <el-checkbox-group v-model="findDialogParams.type">
            <el-checkbox label="A" v-if="findDialogTitle !== '一键找回'">推荐联系人</el-checkbox>
            <el-checkbox label="B">推荐负责人</el-checkbox>
            <el-checkbox label="C">其他负责人</el-checkbox>
            <el-checkbox label="D,E" v-if="findDialogTitle !== '一键评估'">低活跃号</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <el-form-item label="请选择评估类型" v-if="findDialogParams.name === '一键评估'">
          <el-radio-group v-model="findDialogParams.evaluationType">
            <el-radio label="1">标准评估</el-radio>
            <el-radio label="2">高级评估</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="请选择评估年份" v-if="findDialogParams.name === '一键评估'">
          <el-date-picker
            readonly
            size="mini"
            type="year"
            placeholder="选择年"
            format="yyyy"
            value-format="yyyy"
            v-model="findDialogParams.year">
          </el-date-picker>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="findDialogVisible = false">取消</el-button>
        <el-button type="primary" @click="findDialogSure">确定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import store from '@/store'
import { checkRecordList, deleteRecordList, getRecordList, oneKeyAssessment, oneKeyRetrieve } from '@/api/businessManagement'
import { Message } from 'element-ui'

export default {
  data() {
    return {
      id: this.$route.query.id,
      stateOption: [
        { label: "已完成", value: "1" },
        { label: "未完成", value: "0" },
        { label: "错误文件", value: "3" },
      ],
      loading: false,
      tableData: [],
      total: 0,
      searchParams: {
        pageNum: 1,
        pageSize: 20,
        state: '1'
      },
      jobOption: {
        "A": "推荐联系人",
        "B": "推荐负责人",
        "C": "其他负责人",
        "D": "低活跃号",
        "E": "低活跃号"
      },
      dialogType: undefined,
      dialogAssessment: undefined,
      dialogVisible: false,
      loading_: false,
      dialogTableData: [],
      dialogTotal: 0,
      dialogParams: {
        id: undefined,
        pageNum: 1,
        pageSize: 20,
      },
      uploadFieldsOptions: [
        { label: "效益评估（区间）", value: "1" },
        { label: "规模评估（区间）", value: "2" },
        { label: "资产评估（区间）", value: "3" },
        { label: "负债评估（区间）", value: "4" },
        { label: "效益评估", value: "5" },
        { label: "规模评估", value: "6" },
        { label: "资产评估", value: "7" },
        { label: "负债评估", value: "8" },
      ],
      //一键找回
      findDialogVisible: false,
      findDialogTitle: "",
      findDialogParams: {
        id: undefined,
        type: [],
        year: "2023",
        name: undefined,
        evaluationType: undefined,
      }
    }
  },
  computed: {
    myFields() {
      const fields = store.getters.fields;
      return fields.map(value => {
        return this.uploadFieldsOptions.filter(option => option.value === value)[0].label;
      });
    }
  },
  created() {
    this.initTable();
  },
  mounted() {
    // if(this.id) {
    //   this.handleCheckResult({id: this.id})
    // }
  },
  methods: {
    initTable() {
      this.loading = true;
      getRecordList(this.searchParams).then(res => {
        const { total, rows } = res;
        this.tableData = rows;
        this.total = total;
        this.loading = false;
      })
    },
    handleSearch() {
      this.initTable();
    },
    handleSizeChange(v) {
      this.searchParams.pageNum = 1;
      this.searchParams.pageSize = v;
      this.initTable();
    },
    handleCurrentChange(v) {
      this.searchParams.pageNum = v;
      this.initTable();
    },
    getIndex(index) {
      return index + (this.searchParams.pageNum - 1) * this.searchParams.pageSize + 1
    },
    handleDeleteItem(data) {
      this.$confirm('确定删除该记录？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        const { id } = data;
        deleteRecordList(id).then(res => {
          this.initTable();
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
        })
      }).catch(() => {});
    },
    handleExportResult(data) {
      const { id } = data;
      this.download('/enterprise/export', { id }, `企业信息.xlsx`)
    },
    handleCheckResult(data) {
      const { id, type, assessment } = data;
      this.dialogType = type;
      this.dialogAssessment = assessment;

      // 1标准查询
      // 2高级查询
      // 3高级搜索
      // 4企业核验
      // 5企业找回


      this.dialogVisible = true;
      this.dialogTableData = [];
      this.dialogParams = {
        id: id,
        pageNum: 1,
        pageSize: 20,
      };
      this.initDialogTable();
    },
    initDialogTable() {
      this.loading_ = true;
      checkRecordList(this.dialogParams).then(res => {
        const { total, rows } = res;
        this.dialogTableData = rows;
        this.dialogTotal = total;
        this.loading_ = false;
      })
    },
    handleSizeChange_(v) {
      this.dialogParams.pageNum = 1;
      this.dialogParams.pageSize = v;
      this.initDialogTable();
    },
    handleCurrentChange_(v) {
      this.dialogParams.pageNum = v;
      this.initDialogTable();
    },
    getIndex_(index) {
      return index + (this.dialogParams.pageNum - 1) * this.dialogParams.pageSize + 1
    },
    findData(data, type) {
      const { id } = data;
      this.findDialogParams = {
        id,
        type: type !== '一键评估' ? ['B', 'C', 'D,E'] : ['A', 'B', 'C'],
        year: "2023",
        name: type,
        evaluationType: undefined
      };
      this.findDialogTitle = type;
      this.findDialogVisible = true;
    },
    //请选择找回范围确定
    findDialogSure() {
      if(!this.findDialogParams.type.length) {
        Message.error('请选择找回范围')
        return;
      }
      const { id, type, year, name, evaluationType } = this.findDialogParams;
      if(name === "一键评估") {
        if(!this.findDialogParams.year) {
          Message.error('请选择年份')
          return;
        }
        const params = { id, type: type.join(','), year, evaluationType }
        oneKeyAssessment(params).then((res) => {
          this.initTable();
          this.findDialogVisible = false;
        })
      }else {
        const params = { id, type: type.join(',') }
        oneKeyRetrieve(params).then(res => {
          this.initTable();
          this.findDialogVisible = false;
        })
      }
    }
  }
}
</script>
<style lang="scss" scoped>
div.resultSearch {
  .el-input, .el-select {
    width: 180px;
  }
  div.searchBar {
    height: 36px;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    div.searchForm {
      display: flex;
      justify-content: start;
      align-items: center;
      div.name {
        width: 60px;
        margin-right: 5px;
        font-size: 14px;
        &:not(:first-child) {
          margin-left: 14px;
        }
      }
      .el-button {
        margin-left: 14px;
      }
    }
    div.operateForm {
      display: flex;
      justify-content: start;
      align-items: center;
    }
  }
}
</style>

